<template>
    <div class="sdy-home-nav-list">
        <van-swipe class="swiper-containner" :loop="false" :duration="300" indicator-color="red" >
            <van-swipe-item >
                <van-grid :column-num="5" :border="false">
                    <van-grid-item v-for="item in navs" :key="item.id" :icon="item.img" :text="item.title" />
                </van-grid>
            </van-swipe-item>
            <van-swipe-item >
                <van-grid :column-num="5" :border="false">
                    <van-grid-item v-for="item in navs" :key="item.id" :icon="item.img" :text="item.title" />
                </van-grid>
            </van-swipe-item>
           
        </van-swipe>
    </div>
</template>
<script setup lang="ts">
const navs = [
    { id: 1, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 2, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 3, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 4, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 5, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 6, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 7, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 8, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 9, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 10, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 11, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 12, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 13, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
    { id: 14, title: '超市', img: 'https://m.360buyimg.com/mobilecms/s120x120_jfs/t1/125678/35/5947/4868/5efbf28cEbf04a25a/e2bcc411170524f0.png' },
]
</script>
<style scoped lang="scss">
.sdy-home-nav-list {
    height: 210px;
    box-sizing: border-box;
    padding: 15px;



    >.swiper-containner {
        height: 100%;
    }


}
</style>